import React, { useEffect, useRef } from 'react'
import * as echarts from 'echarts';

function Echarts(props) {
    const {option,width,height}=props
    const box=useRef();
    const myChart=useRef();

    let fn=function(){
        myChart.current.resize();
    }
    useEffect(()=>{
        myChart.current = echarts.init(box.current);
        option && myChart.current.setOption(option);

        window.addEventListener('resize',fn)
        return ()=>{
            window.removeEventListener('resize',fn)
            myChart.current.dispose();
        }
    },[])
  return (
    <div ref={box} style={{width:width, height:height}}>
      
    </div>
  )
}

export default Echarts
